<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>跑步管理</title>
    <link rel="stylesheet" href="../../plugins/element-ui/index.css">
    <!--    <script src="../../plugins/element-ui/index.js"></script>-->
    <!--    <script src="../../plugins/vue/vue.js"></script>-->
    <script src="../../plugins/echarts/echarts.js"></script>
    <style>
        .el-input {
            width: 150px;
        }

        span {
            font-size: 10px;
        }

        .el-date-picker {

        }

        /*.el-select{
            width: 100px;
        }
*/
        #chart-container {
            position: relative;
            width: 1500px;
            height: 100vh;
        }

        #chart-container-analyze {
            position: relative;
            width: 1500px;
            height: 100vh;
        }

        #chart-container-quantity {
            position: relative;
            height: 100vh;
            overflow: hidden;
            width: 1500px;

        }

        .el-input__inner {
            width: 100px;
        }

        .el-input {
            width: 100px;
        }

        .el-date-editor.el-input, .el-date-editor.el-input__inner {
            width: 100px;
        }
    </style>
</head>
<body>
<div id="app">

    <el-tabs type="border-card">

        <el-tab-pane label="学生数据">
            <span slot="label" @click="StudentDataList()">学生数据</span>

            <div>
                <template>

                    <span>学期名称：</span>
                    <el-select v-model="StudentRunningOptions.semesterName" filterable size="mini" placeholder="请选择">
                        <el-option v-for="item in SemesterSelection" :key="item.value" :label="item.label" :value="item.value"></el-option>
                    </el-select>
                    <span> 院系名称：</span>
                    <el-select v-model="StudentRunningOptions.deptName" size="mini" filterable placeholder="请选择">
                        <el-option v-for="item in deptNames" size="mini" :key="item.label" :label="item.label"
                                   :value="item.label"></el-option>
                    </el-select>
                    <span style="font-size: 13px"> 入学年份:</span>
                    <template>
                        <el-select v-model="StudentRunningOptions.goschoolYear" filterable placeholder="请选择" size="mini">
                            <el-option v-for="item in goSchoolYears" :key="item.value" :label="item.label" :value="item.value">
                            </el-option>
                        </el-select>
                    </template>
                    <span>性别：</span>
                    <el-select v-model="StudentRunningOptions.sex" filterable size="mini" placeholder="请选择">
                        <el-option v-for="item in chooseGender" :key="item.value" :label="item.label"
                                   :value="item.value"></el-option>
                    </el-select>
                    <span> 学生姓名：</span>
                    <el-input v-model="StudentRunningOptions.sname" size="mini" placeholder="请输入内容"></el-input>
                </template>
                <!--
                    点击查询 调用查询
                -->
                <el-button type="primary" size="mini" @click="StudentDataList()">查询</el-button>
                <el-button size="mini" @click="studentreset()">重置</el-button>
                <el-button type="primary" size="mini" style="margin-left: 20%" @click="studentExport()">导出</el-button>
            </div>
            <!--
                                [{
                                stid:1,
                                deptName:"deptName",
                                goschoolYear: "goschoolYear",
                                semesterName: "semesterName",
                                sno: 1,
                                name: "name",
                                sex:"sex",
                                validCount : 1,
                                validMiles : 1.1
                            }
                            ]
                                -->
            <el-table
                    :data="StudentRunningDataList"
                    style="width: 100%">
                <el-table-column
                        label="序号"
                        prop="stid">
                </el-table-column>
                <el-table-column
                        label="院系名称"
                        prop="deptName">
                </el-table-column>
                <el-table-column
                        label="入学年份"
                        prop="goschoolYear">
                </el-table-column>
                <el-table-column
                        label="学期名称"
                >
                    <template slot-scope="scope">
                        <div slot="reference" class="name-wrapper" v-if="scope.row.semesterName == 0">
                            <el-tag size="medium">上学期</el-tag>
                        </div>
                        <div slot="reference" class="name-wrapper" v-if="scope.row.semesterName == 1">
                            <el-tag size="medium">下学期</el-tag>
                        </div>
                    </template>
                </el-table-column>



                <el-table-column
                        label="学号"
                        prop="sno">
                </el-table-column>
                <el-table-column
                        label="姓名"
                        prop="sname">
                </el-table-column>
                <el-table-column
                        label="性别"
                        >
                    <template slot-scope="scope">
                        <div slot="reference" class="name-wrapper" v-if="scope.row.sex == 1">
                            <el-tag size="medium">男</el-tag>
                        </div>
                        <div slot="reference" class="name-wrapper" v-if="scope.row.sex == 0">
                            <el-tag size="medium">女</el-tag>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column
                        label="有效次数"
                        prop="validCount">
                </el-table-column>
                <el-table-column
                        label="有效里程(公里)"
                        prop="validMiles">
                </el-table-column>

                <!-- <el-table-column
                         label="结束时间"
                         align="center">
                     <template slot-scope="scope">
                         <el-button
                                 size="mini"
                                 @click="handleEdit(scope.$index, scope.row)">删除</el-button>
                     </template>
                 </el-table-column>-->
            </el-table>
            <div class="block">
                <el-pagination
                        @size-change="handleSizeChangeStudentData"
                        @current-change="handleCurrentChangeStudentData"
                        :current-page="paginationStudentData.currentPage"
                        :page-sizes="[10, 20, 30, 40]"
                        :page-size="paginationStudentData.pageCount"
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="paginationStudentData.totalCount">
                </el-pagination>
            </div>
        </el-tab-pane>
        <el-tab-pane label="跑步明细">
            <span slot="label" @click="runningDetailsList()">跑步明细</span>
            <div>
                <template>

                    <span>学期名称：</span>
                    <el-select v-model="RunningDetailsOptions.semesterName" filterable size="mini" placeholder="请选择">
                        <el-option v-for="item in SemesterSelection" :key="item.value" :label="item.label" :value="item.value"></el-option>
                    </el-select>
                    <span> 院系名称：</span>
                    <el-select v-model="RunningDetailsOptions.deptName" size="mini" filterable placeholder="请选择">
                        <el-option v-for="item in deptNames" size="mini" :key="item.label" :label="item.label"
                                   :value="item.label"></el-option>
                    </el-select>
                    <span style="font-size: 13px"> 入学年份:</span>
                    <template>
                        <el-select v-model="RunningDetailsOptions.goschoolYear" filterable placeholder="请选择" size="mini">
                            <el-option v-for="item in goSchoolYears" :key="item.value" :label="item.label" :value="item.value">
                            </el-option>
                        </el-select>
                    </template>
                    <span>性别：</span>
                    <el-select v-model="RunningDetailsOptions.sex" filterable size="mini" placeholder="请选择">
                        <el-option v-for="item in chooseGender" :key="item.value" :label="item.label"
                                   :value="item.value"></el-option>
                    </el-select>
                    <span> 学生姓名：</span>
                    <el-input v-model="RunningDetailsOptions.sname" size="mini" placeholder="请输入内容"></el-input>
                </template>
                <!--
                    点击查询 调用查询
                -->
                <el-button type="primary" size="mini" @click="runningDetailsList()">查询</el-button>
                <el-button size="mini" @click="runningDetailsReset()">重置</el-button>
                <el-button type="primary" size="mini" style="margin-left: 20%" @click="studentExport()">导出</el-button>
            </div>
            <el-table
                    :data="RunningDetailsList"
                    style="width: auto">
                <el-table-column
                        label="序号"
                        prop="stid">
                </el-table-column>
                <el-table-column
                        label="院系名称"
                        prop="deptName">
                </el-table-column>
                <el-table-column
                        label="入学年份"
                        prop="goschoolYear">
                </el-table-column>




                <el-table-column
                        label="学号"
                        prop="sno">
                </el-table-column>
                <el-table-column
                        label="姓名"
                        prop="sname">
                </el-table-column>
                <el-table-column
                        label="性别"
                >
                    <template slot-scope="scope">
                        <div slot="reference" class="name-wrapper" v-if="scope.row.sex == 1">
                            <el-tag size="medium">男</el-tag>
                        </div>
                        <div slot="reference" class="name-wrapper" v-if="scope.row.sex == 0">
                            <el-tag size="medium">女</el-tag>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column
                        label="是否有效"
                        prop="isValid">
                </el-table-column>
                <el-table-column
                        label="跑步里程(公里)"
                        prop="validMiles">
                </el-table-column>
                <el-table-column
                        label="打卡编号"
                        prop="cardNums">
                </el-table-column>

                <el-table-column
                        label="平均配速"
                        prop="speed">
                </el-table-column>
                <el-table-column
                        label="开始时间"
                        prop="stateTime">
                </el-table-column>
                <el-table-column
                        label="结束时间"
                        prop="endTime">
                </el-table-column>
            </el-table>

            <div class="block">
                <el-pagination
                        @size-change=" handleSizeChangeRunningDetails"
                        @current-change="handleCurrentChangeRunningDetails"
                        :current-page="paginationRunningDetails.currentPage"
                        :page-sizes="[10, 20, 30, 40]"
                        :page-size="paginationRunningDetails.pageCount"
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="paginationRunningDetails.totalCount">
                </el-pagination>
            </div>
        </el-tab-pane>
        <el-tab-pane label="学校院系概况">
            <div>
                <template>
                    <span>学期名称：</span>
                    <el-select v-model="schoolFrom.SemesterName" filterable size="mini" placeholder="请选择">
                        <el-option v-for="item in options" :key="item.value" :label="item.label"
                                   :value="item.value"></el-option>
                    </el-select>
                    <span> 入学年份：</span>
                    <el-date-picker
                            size="mini"
                            v-model="schoolFrom.goschoolYear"
                            type="year"
                            placeholder="请选择"
                    >
                    </el-date-picker>
                    <span>性别：</span>
                    <el-select v-model="schoolFrom.sex" filterable size="mini" placeholder="请选择">
                        <el-option v-for="item in options" :key="item.value" :label="item.label"
                                   :value="item.value"></el-option>
                    </el-select>
                    <span> 日期：</span>
                    <el-date-picker
                            style="width: 200px"
                            size="mini"
                            v-model="schoolFrom.Date"
                            type="daterange"
                            range-separator="至"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期">
                    </el-date-picker>


                </template>
                <el-button type="primary" size="mini" @click="schoolSelect()">查询</el-button>
                <el-button size="mini" @click="schoolReset(schoolFrom)">重置</el-button>
                <el-button type="primary" style="margin-left: 27%" size="mini" @click="schoolExport()">导出</el-button>
            </div>
            <el-table
                    :data="tableData"
                    style="width: auto"
                    :default-sort="{prop: 'startYear', order: 'descending'}"
            >
                <el-table-column label="xxx学校各院系跑步概况" align="center">
                    <el-table-column
                            label="院系"
                            prop="deptName">
                    </el-table-column>
                    <el-table-column
                            label="总有效次数"
                            sortable
                            prop="isTotalStart">
                    </el-table-column>
                    <el-table-column
                            label="总有效里程"
                            sortable
                            prop="isTotalMileage">
                    </el-table-column>
                    <el-table-column
                            label="总参与人数"
                            sortable
                            prop="totalMember">
                    </el-table-column>
                    <el-table-column
                            label="有效人均次数"
                            sortable
                            prop="perStatus">
                    </el-table-column>
                    <el-table-column
                            label="有效人均里程"
                            sortable
                            prop="isPerMileage">
                    </el-table-column>
                </el-table-column>
            </el-table>
           <!-- <div class="block">
                <el-pagination
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChange"
                        :current-page="currentPage4"
                        :page-sizes="[10, 20, 30, 40]"
                        :page-size="10"
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="0">
                </el-pagination>
            </div>-->
        </el-tab-pane>
        <el-tab-pane label="成绩分布分析">
            <div>
                <template>
                    <span>学期名称：</span>
                    <el-select v-model="scoreFrom.SemesterName" filterable size="mini" placeholder="请选择">
                        <el-option v-for="item in options" :key="item.value" :label="item.label"
                                   :value="item.value"></el-option>
                    </el-select>
                    <span> 入学年份：</span>
                    <el-date-picker
                            size="mini"
                            v-model="scoreFrom.goschoolYear"
                            type="year"
                            placeholder="请选择"
                    >
                    </el-date-picker>
                    <span> 院系名称：</span>
                    <el-select v-model="scoreFrom.deptName" size="mini" filterable placeholder="请选择">
                        <el-option v-for="item in options" size="mini" :key="item.value" :label="item.label"
                                   :value="item.value"></el-option>
                    </el-select>
                    <span>性别：</span>
                    <el-select v-model="scoreFrom.sex" filterable size="mini" placeholder="请选择">
                        <el-option v-for="item in options" :key="item.value" :label="item.label"
                                   :value="item.value"></el-option>
                    </el-select>
                    <span> 日期：</span>

                    <el-date-picker
                            style="width: 200px"
                            size="mini"
                            v-model="scoreFrom.Date"
                            type="daterange"
                            range-separator="至"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期">
                    </el-date-picker>


                </template>
                <el-button type="primary" size="mini" @click="scoreSelect()">查询</el-button>
                <el-button size="mini" @click="scoreReset(scoreFrom)">重置</el-button>
                <el-button type="primary" style="margin-left: 8%" size="mini" @click="scoreExport()">导出</el-button>
                <el-button type="primary" style="margin-left: 94%" size="mini" @click="dialog = true">统计设置</el-button>
            </div>
            <div id="chart-container"></div>
            <el-drawer
                    title="设置统计颗粒度"
                    :before-close="handleClose"
                    :visible.sync="dialog"
                    direction="rtl"
                    custom-class="demo-drawer"
                    ref="drawer"
                    size="40%"
            >
                <div class="demo-drawer__content">
                    <el-form :model="form">
                        <el-form-item label="统计名称" :label-width="formLabelWidth">
                            <el-input v-model="form.name" size="mini" autocomplete="off"></el-input>
                        </el-form-item>
                        <el-form-item label="统计范围" :label-width="formLabelWidth">
                            <el-radio v-model="radio" label="1">统计值大于等于</el-radio>
                            <el-input v-model="input" size="mini" style="width: 50px"></el-input>
                            次
                            <el-radio v-model="radio" label="2">统计值小于等于</el-radio>
                            <el-input v-model="input" size="mini" style="width: 50px"></el-input>
                            次
                        </el-form-item>
                        <el-form-item label="" :label-width="formLabelWidth">
                            <el-button type="primary" size="mini" @click="save()" style="margin-left: 40%;width: 100px">
                                保存
                            </el-button>
                        </el-form-item>


                        <el-table
                                :data="setUpTableData"
                                border
                                style="width: 100%">
                            <el-table-column
                                    prop="date"
                                    label="序号"
                                    align="center"
                                    width="50">
                            </el-table-column>
                            <el-table-column
                                    prop="name"
                                    label="名称"
                                    align="center"
                                    width="70">
                            </el-table-column>
                            <el-table-column
                                    prop="address"
                                    align="center"
                                    label="统计范围">
                            </el-table-column>
                            <el-table-column
                                    prop="set"
                                    align="center"
                                    width="100"
                                    label="操作">
                                <div>
                                    <el-link type="primary">编辑</el-link>
                                    <el-link type="danger">删除</el-link>
                                </div>
                            </el-table-column>
                        </el-table>

                    </el-form>
                    <div class="demo-drawer__footer" style="text-align: center;margin-top: 10px">
                        <el-button @click="cancelForm">取 消</el-button>
                        <el-button type="primary" @click="$refs.drawer.closeDrawer()" :loading="loading">
                            {{ loading ? '提交中 ...' : '确 定' }}
                        </el-button>
                    </div>
                </div>
            </el-drawer>


        </el-tab-pane>

        <el-tab-pane label="跑步评分分析">
            <div>
                <template>
                    <span>学期名称：</span>
                    <el-select v-model="runScoreFrom.SemesterName" filterable size="mini" placeholder="请选择">
                        <el-option v-for="item in options" :key="item.value" :label="item.label"
                                   :value="item.value"></el-option>
                    </el-select>
                    <span> 入学年份：</span>
                    <el-date-picker
                            size="mini"
                            v-model="runScoreFrom.goschoolYear"
                            type="year"
                            placeholder="请选择"
                    >
                    </el-date-picker>
                    <span> 院系名称：</span>
                    <el-select v-model="runScoreFrom.deptName" size="mini" filterable placeholder="请选择">
                        <el-option v-for="item in options" size="mini" :key="item.value" :label="item.label"
                                   :value="item.value"></el-option>
                    </el-select>
                    <span>性别：</span>
                    <el-select v-model="runScoreFrom.sex" filterable size="mini" placeholder="请选择">
                        <el-option v-for="item in options" :key="item.value" :label="item.label"
                                   :value="item.value"></el-option>
                    </el-select>
                    <span> 日期：</span>

                    <el-date-picker
                            style="width: 200px"
                            size="mini"
                            v-model="runScoreFrom.Date"
                            type="daterange"
                            range-separator="至"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期">
                    </el-date-picker>
                </template>
                <el-button type="primary" size="mini" @click="runScoreSelect()">查询</el-button>
                <el-button size="mini" @click="runScoreReset(runScoreFrom)">重置</el-button>
                <el-button type="primary" style="margin-left: 13%" size="mini" @click="runScoreExport()">导出</el-button>
            </div>
            <div id="chart-container-analyze"></div>

        </el-tab-pane>
        <el-tab-pane label="有效次数分析">
            <div>
                <template>
                    <span>学期名称：</span>
                    <el-select v-model="frequencyFrom.SemesterName" filterable size="mini" placeholder="请选择">
                        <el-option v-for="item in options" :key="item.value" :label="item.label"
                                   :value="item.value"></el-option>
                    </el-select>
                    <span> 入学年份：</span>
                    <el-date-picker
                            size="mini"
                            v-model="frequencyFrom.goschoolYear"
                            type="year"
                            placeholder="请选择"
                    >
                    </el-date-picker>
                    <span> 院系名称：</span>
                    <el-select v-model="frequencyFrom.deptName" size="mini" filterable placeholder="请选择">
                        <el-option v-for="item in options" size="mini" :key="item.value" :label="item.label"
                                   :value="item.value"></el-option>
                    </el-select>
                    <span>性别：</span>
                    <el-select v-model="frequencyFrom.sex" filterable size="mini" placeholder="请选择">
                        <el-option v-for="item in options" :key="item.value" :label="item.label"
                                   :value="item.value"></el-option>
                    </el-select>
                    <span> 日期：</span>

                    <el-date-picker
                            style="width: 200px"
                            size="mini"
                            v-model="frequencyFrom.Date"
                            type="daterange"
                            range-separator="至"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期">
                    </el-date-picker>


                </template>
                <el-button type="primary" size="mini" @click="frequencySelect()">查询</el-button>
                <el-button size="mini" @click="frequencyReset(frequencyFrom)">重置</el-button>
                <el-button type="primary" style="margin-left: 13%" size="mini" @click="frequencyExport()">导出</el-button>
            </div>
            <div id="chart-container-quantity"></div>
        </el-tab-pane>
        <el-tab-pane label="打卡地点设置">
            <div>
                <span> 打卡地点名称：</span>
                <el-input v-model="addressFrom.addressName" size="mini" placeholder="请输入内容"></el-input>
                <span>状态：</span>
                <el-select v-model="addressFrom.state" filterable size="mini" placeholder="请选择">
                    <el-option v-for="item in options" :key="item.value" :label="item.label"
                               :value="item.value"></el-option>
                </el-select>
                <el-button type="primary" size="mini" @click="addressSelect()">查询</el-button>
                <el-button size="mini" @click="addressReset(addressFrom)">重置</el-button>
            </div>
        </el-tab-pane>
        <el-tab-pane label="跑步规则设置">
            <div>
                <span>学期名称：</span>
                <el-select v-model="runRuleFrom.SemesterName" filterable size="mini" placeholder="请选择">
                    <el-option v-for="item in options" :key="item.value" :label="item.label"
                               :value="item.value"></el-option>
                </el-select>
                <el-button type="primary" size="mini" @click="runRuleSelect()">查询</el-button>
                <el-button size="mini" @click="runRuleReset(runRuleFrom)">重置</el-button>
            </div>

        </el-tab-pane>
    </el-tabs>
</div>
<!-- 开发环境版本，包含了有帮助的命令行警告 -->
<script src="../../plugins/vue/vue.js"></script>
<!-- 引入组件库 -->
<script src="../../plugins/element-ui/index.js"></script>
<!-- 引入axios -->
<script src="../../plugins/axios/axios.min.js"></script>
<script src="../../js/request.js"></script>
<script src="../../api/sportList.js"></script>

<script>
    window.onload = function () {
        var dom = document.getElementById('chart-container');
        var myChart = echarts.init(dom, null, {
            renderer: 'canvas',
            useDirtyRect: false
        });
        var app = {};

        var option;

        option = {
            tooltip: {
                trigger: 'item'
            },
            legend: {
                top: '5%',
                left: 'center'
            },
            series: [
                {
                    name: 'Access From',
                    type: 'pie',
                    radius: ['40%', '70%'],
                    avoidLabelOverlap: false,
                    itemStyle: {
                        borderRadius: 10,
                        borderColor: '#fff',
                        borderWidth: 2
                    },
                    label: {
                        show: false,
                        position: 'center'
                    },
                    emphasis: {
                        label: {
                            show: true,
                            fontSize: '40',
                            fontWeight: 'bold'
                        }
                    },
                    labelLine: {
                        show: false
                    },
                    //
                    data: [
                        {value: 1048, name: '40次以上的'},
                        {value: 1035, name: '20~39次'},
                        {value: 580, name: '5~19次'},
                        {value: 484, name: '0~4次'}
                    ]
                }
            ]
        };

        if (option && typeof option === 'object') {
            myChart.setOption(option);
        }

        window.addEventListener('resize', myChart.resize);







        var dom = document.getElementById('chart-container-analyze');
        var myChartAnalyze = echarts.init(dom, null, {
            renderer: 'canvas',
            useDirtyRect: false
        });

        var optionAnalyze;

        optionAnalyze = {
            xAxis: {
                type: 'category',
                boundaryGap: false,
                data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
            },
            yAxis: {
                type: 'value'
            },
            series: [
                {
                    data: [820, 932, 901, 934, 1290, 1330, 1320],
                    type: 'line',
                    areaStyle: {}
                }
            ]
        };

        if (optionAnalyze && typeof optionAnalyze === 'object') {
            myChartAnalyze.setOption(optionAnalyze);
        }

        window.addEventListener('resize', myChartAnalyze.resize);









        var dom = document.getElementById('chart-container-quantity');
        var myChart = echarts.init(dom, null, {
            renderer: 'canvas',
            useDirtyRect: false
        });
        var app = {};

        var option;

        option = {
            title: {
                text: 'Stacked Line'
            },
            tooltip: {
                trigger: 'axis'
            },
            legend: {
                data: ['Email', 'Union Ads', 'Video Ads', 'Direct', 'Search Engine']
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            toolbox: {
                feature: {
                    saveAsImage: {}
                }
            },
            xAxis: {
                type: 'category',
                boundaryGap: false,
                data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
            },
            yAxis: {
                type: 'value'
            },
            series: [
                {
                    name: 'Email',
                    type: 'line',
                    stack: 'Total',
                    data: [120, 132, 101, 134, 90, 230, 210]
                },
                {
                    name: 'Union Ads',
                    type: 'line',
                    stack: 'Total',
                    data: [220, 182, 191, 234, 290, 330, 310]
                }
            ]
        };

        if (option && typeof option === 'object') {
            myChart.setOption(option);
        }

        window.addEventListener('resize', myChart.resize);
    }
</script>
<script>
    new Vue({
        el: '#app',
        data() {
            return {
                /*
                *
                * 学生管理 入学年份下拉框 数据
                * */

                goSchoolYears:[

                ],
                /*
               * 选择性别
               * label  显示
               * value  值
               * */
                chooseGender: [
                    {value: '1', label: '男'},
                    {value: '2', label: '女'},
                ],

                /*
                * 院系名称  学生管理
                * */
                deptNames:[
                ],


                /*  学生管理
                    stid 序号
                    deptName 院系名称
                    goschoolYear 入学年份
                    semesterName 学期名称
                    sno 学号
                    name 名字
                    sex 性别
                    validCount 有效次数
                    validMiles 有效公里
                 */

                /*
                *
                * 学期名称下拉框  学生管理
                * */
                SemesterSelection: [
                    {value: '0', label: '上学期'},
                    {value: '1', label: '下学期'},
                ],
                    /*
                    学生管理 遍历数据
                    * */
                StudentRunningDataList:[

                ],/*
                    学生管理条件json数据
                */
                StudentRunningOptions:{
                    semesterName:"",
                    deptName:"",
                    goschoolYear:"",
                    sex:"",
                    sname:""
                },/*
                    学生管理的分页数据
                */
                paginationStudentData: {
                    currentPage: 1, // 当前页面
                    pageCount: 10, // 每页展示条
                    totalCount: 0 // 总页数
                },










                /*
                   跑步明细 遍历数据
                   * */
                RunningDetailsList:[

                ],/*
                   跑步明细条件json数据
                */
                RunningDetailsOptions:{
                    semesterName:"",
                    deptName:"",
                    goschoolYear:"",
                    sex:"",
                    sname:""
                },/*
                    跑步明细的分页数据
                */
                paginationRunningDetails: {
                    currentPage: 1, // 当前页面
                    pageCount: 10, // 每页展示条
                    totalCount: 0 // 总页数
                },










                setUpTableData: [{
                    date: '1',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1518 弄'
                }, {
                    date: '2',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1517 弄'
                }, {
                    date: '3',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1519 弄'
                }, {
                    date: '4',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1516 弄'
                }],
                currentPage4: 4,
                radio: '1',
                input: '',
                options: [
                    {value: '选项1', label: '黄金糕'},
                    {value: '选项2', label: '双皮奶'},
                    {value: '选项3', label: '蚵仔煎'},
                    {value: '选项4', label: '龙须面'},
                    {value: '选项5', label: '北京烤鸭'}
                ],
                //学生数据搜索框
                studentFrom: {
                    SemesterName: '',
                    deptName: '',
                    goschoolYear: '',
                    sex: '',
                    name: ''
                },
                //跑步明细搜索框
                runFrom: {
                    SemesterName: '',
                    deptName: '',
                    goschoolYear: '',
                    sex: '',
                    name: ''
                },
                //学校院系概况搜索框
                schoolFrom: {
                    SemesterName: '',
                    goschoolYear: '',
                    sex: '',
                    Date: ''
                },
                //成绩分布搜索框
                scoreFrom: {
                    SemesterName: '',
                    goschoolYear: '',
                    sex: '',
                    Date: '',
                    deptName: ''
                },
                //有效次数搜索框
                frequencyFrom: {
                    SemesterName: '',
                    goschoolYear: '',
                    sex: '',
                    Date: '',
                    deptName: ''
                },
                //跑步评分搜索框
                runScoreFrom: {
                    SemesterName: '',
                    goschoolYear: '',
                    sex: '',
                    Date: '',
                    deptName: ''
                },
                //打卡地点搜索框
                addressFrom: {
                    addressName: '',
                    state: ''
                },
                //跑步规则设置搜索框
                runRuleFrom: {
                    SemesterName: ''
                },
                //  --未对应属性
                tableData: [{
                    serialNumber: 'serialNumber', //序号--
                    deptName: '建筑学院', //院系名称--
                    goschoolYear: '2020', //入学年份
                    semesterName: '上学期', //学期名称--
                    sno: '20205578', //学号
                    name: '张三', //姓名
                    sex: '男', //性别
                    isValid: '是',//是否有效
                    validCount: '10', //有效次数
                    validMiles: '5.4',//有效里程
                    miles: '6.5',//跑步里程
                    cardNums: '9003',//打卡编号
                    speed: '',//平均配速
                    startTime: '',//开始时间
                    endTime: '',//结束时间
                    isTotalStart: '8',//总有效次数//--
                    isTotalMileage: '20.4',//总有效里程--
                    totalMember: '10',//总参与人数--
                    perStatus: '3',//有效人均次数--
                    isPerMileage: '4.3',//有效人均里程--
                }], form: {
                    name: '',
                    date1: '',
                    date2: '',
                    delivery: false,
                    type: [],
                    resource: '',
                    desc: ''
                },
                formLabelWidth: '80px',
                timer: null,
                loading: false,
                dialog: false
            }
        },
        created() {
            this.StudentDataList()
            this.DeptNameAndDidList()
            this.GoSchoolYearList()
        },
        methods: {
            //学生数据 模糊查询
            studentSelect() {
                console.log(this.StudentRunningOptions)
                this.StudentDataList()
            },
            //入学年份 下拉框
            GoSchoolYearList(){
                getGoSchoolYearList().then((response) => {
                   this.goSchoolYears =  response.data.data.goSchoolYears
                })
            },

            /*
            * 查询院系名称
            * */
            DeptNameAndDidList(){
                getDeptNameAndDidList().then( (response) => {
                    this.deptNames   =  response.data.data.depts
                })
            },


            //学生数据 分页
            handleSizeChangeStudentData(val) {
               this.paginationStudentData.pageCount = val
            },
            /*
            * 学生数据
            * */
            handleCurrentChangeStudentData(val) {
                this.paginationStudentData.currentPage = val
                this.StudentDataList()
            },

            // 学生数据 重置
            studentreset() {
                this.StudentRunningOptions = {
                    semesterName:"",
                    deptName:"",
                    goschoolYear:"",
                    sex:"",
                    sname:""
                }
               this.paginationStudentData =  {
                    currentPage: 1, // 当前页面
                        pageCount: 10, // 每页展示条
                        totalCount: 0 // 总页数
                }
                this.StudentDataList()
            },

            /*
            * 学生数据 分页加条件的方法
            * */
            StudentDataList(){
                studentDataPage(this.paginationStudentData.currentPage,this.paginationStudentData.pageCount,this.StudentRunningOptions).then( (response) => {
                    this.StudentRunningDataList = response.data.data.page.records
                    this.paginationStudentData.currentPage = response.data.data.page.current
                    this.paginationStudentData.pageCount = response.data.data.page.size
                    this.paginationStudentData.totalCount = response.data.data.page.total
                })
            },

            //跑步明细 分页
            handleSizeChangeRunningDetails(val) {
                this.paginationRunningDetails.pageCount = val
            },
            /*
            * 跑步明细
            * */
            handleCurrentChangeRunningDetails(val) {
                this.paginationRunningDetails.currentPage = val
                this.runningDetailsList()
            },
            /*
                        * 跑步明细 分页加条件的方法
                        * */
            runningDetailsList(){
                runningDetailsPage(this.paginationRunningDetails.currentPage,this.paginationRunningDetails.pageCount,this.RunningDetailsOptions).then( (response) => {
                    console.log(response)
                    this.RunningDetailsList = response.data.data.page.records
                    this.paginationRunningDetails.currentPage = response.data.data.page.current
                    this.paginationRunningDetails.pageCount = response.data.data.page.size
                    this.paginationRunningDetails.totalCount = response.data.data.page.total
                })
            },


            // 跑步明细 重置
            runningDetailsReset() {
                this.RunningDetailsOptions = {
                    semesterName:"",
                    deptName:"",
                    goschoolYear:"",
                    sex:"",
                    sname:""
                }
                this.paginationRunningDetails =  {
                    currentPage: 1, // 当前页面
                    pageCount: 10, // 每页展示条
                    totalCount: 0 // 总页数
                }
                this.runningDetailsList()
            },










            handleClose(done) {
                if (this.loading) {
                    return;
                }
                this.$confirm('确定要提交表单吗？')
                    .then(_ => {
                        this.loading = true;
                        this.timer = setTimeout(() => {
                            done();
                            // 动画关闭需要一定的时间
                            setTimeout(() => {
                                this.loading = false;
                            }, 400);
                        }, 2000);
                    })
                    .catch(_ => {
                    });
            },
            cancelForm() {
                this.loading = false;
                this.dialog = false;
                clearTimeout(this.timer);
            },
            //设置统计颗粒度数据保存
            save() {

            },

            studentExport() {

            },
            /*跑步明细*/
            runSelect() {

            },
            //重置
            runReset(runFrom) {
                runFrom.SemesterName = '',
                    runFrom.deptName = '',
                    runFrom.goschoolYear = '',
                    runFrom.sex = '',
                    runFrom.name = ''
            },
            runExport() {

            },
            /*//学校院系概况*/
            schoolSelect() {

            },
            //重置
            schoolReset(schoolFrom) {
                schoolFrom.SemesterName = '',
                    schoolFrom.goschoolYear = '',
                    schoolFrom.sex = '',
                    schoolFrom.Date = ''
            },
            schoolExport() {

            },
            //成绩分布分析
            scoreSelect() {

            },
            //重置
            scoreReset(scoreFrom) {
                scoreFrom.SemesterName = '',
                scoreFrom.goschoolYear = '',
                scoreFrom.sex = '',
                scoreFrom.Date = '',
                scoreFrom.deptName = ''
            },
            scoreExport() {

            },
            //有效次数分析
            frequencySelect() {

            },
            //重置
            frequencyReset(frequencyFrom) {
                frequencyFrom.SemesterName = '',
                    frequencyFrom.goschoolYear = '',
                    frequencyFrom.sex = '',
                    frequencyFrom.Date = '',
                    frequencyFrom.deptName = ''
            },
            frequencyExport() {

            },
            //跑步评分分析
            runScoreSelect() {

            },
            //重置
            runScoreReset(runScoreFrom) {
                runScoreFrom.SemesterName = '',
                runScoreFrom.goschoolYear = '',
                runScoreFrom.sex = '',
                runScoreFrom.Date = '',
                runScoreFrom.deptName = ''
            },
            runScoreExport() {

            },
            //打卡地点设置
            addressSelect() {

            },
            addressReset(addressFrom) {
                addressFrom.addressName = '',
                    addressFrom.state = ''
            },
            //跑步规则设置 条件查询
            runRuleSelect() {

            },
            //重置
            runRuleReset(runRuleFrom) {
                runRuleFrom.SemesterName = ''
            }


        }

    })
</script>

</body>
</html>